<template>
	<view class="container">
		<view style="margin-bottom: 20%;">
			<uv-navbar :title="title" @leftClick="leftClick"></uv-navbar>
		</view>
		<uv-form labelPosition="left" :model="model" ref="form">
			<view class="text">
				<view class="text-1">
					<uv-form-item label="店员姓名" prop="tellerName" label-width="100px">
						<uv-input v-model="model.tellerName" border="none" placeholder="请输入姓名">
						</uv-input>
					</uv-form-item>
				</view>
			</view>
			<!-- 			<view class="text" style="margin-top: 5%;">
				<view class="text-1">
					<uv-form-item label="店员编号" prop="tellerNo" label-width="100px">
						<uv-input v-model="model.tellerNo" border="none" placeholder="请输入操作员编号">
						</uv-input>
					</uv-form-item>
				</view>
			</view> -->
			<view class="text" style="margin-top: 5%;">
				<view class="text-1">
					<uv-form-item label="POS号" prop="posNo" label-width="100px">
						<uv-input v-model="model.posNo" border="none" placeholder="请输入POS号">
						</uv-input>
					</uv-form-item>
				</view>
			</view>
			<view class="text" style="margin-top: 5%;">
				<view class="text-1">
					<uv-form-item label="店员手机号" prop="loginName" label-width="100px">
						<uv-input v-model="model.loginName" border="none" placeholder="请输入店员手机号">
						</uv-input>
					</uv-form-item>
				</view>
			</view>
			<view class="text" style="margin-top: 5%;">
				<view class="text-1">
					<uv-form-item label="店员登录密码" prop="pwd" label-width="100px">
						<uv-input v-model="model.pwd" border="none" placeholder="请输入店员登录密码">
						</uv-input>
					</uv-form-item>
				</view>
			</view>
			<view class="text" style="margin-top: 5%;">
				<view class="text-1">
					<uv-form-item label="店员角色" prop="type" @click="showSexSelect" label-width="100px">
						<uv-input v-model="type" disabled disabledColor="#ffffff" placeholder="请选择角色" border="none">
						</uv-input>
						<template v-slot:right>
							<uv-icon name="arrow-right"></uv-icon>
						</template>
					</uv-form-item>
				</view>
			</view>
			<uv-action-sheet ref="sexSelect" :actions="actions" title="请选择角色" @select="sexSelect">
			</uv-action-sheet>
		</uv-form>
		<view class="button-wrap">
			<!-- 确定 -->
			<button class="button-login" @click="navigateToAccountLogin">
				<text class="wx-login loginText1">确定</text>
			</button>
		</view>
	</view>
</template>

<script>
	import {
		posTellerArr,
		posTellerData
	} from "@/network/mine.js"
	import {
		baseURL
	} from '@/network/base.js'; //导入接口的前缀地址
	export default {
		data() {
			return {
				model: {
					shopNo: "",
					status: "1",
					source: "1"
				},
				tellerNo: null,
				params: {
					tellerNo: ''
				},
				actions: [{
						name: '店长',
						id: 1
					},
					{
						name: '管理员',
						id: 2
					}, {
						name: '店员',
						id: 3
					}
				],
				type: "",
				title: ''
			}
		},
		onLoad(e) {
			const arr = uni.getStorageSync('listData')
			this.model.shopNo = arr.merNo
			if (e.title != 1) {
				this.title = "修改员工信息"
				console.log(e.model)
				this.model = JSON.parse(decodeURIComponent(e.model))
				this.tellerNo = this.model.tellerNo
				if (this.model.type == 1) {
					this.type = '店长'
				} else if (this.model.type == 2) {
					this.type = '管理员'
				} else if (this.model.type == 3) {
					this.type = '店员'
				}
			} else {
				this.title = "新增员工"
				this.tellerNo = null
			}
		},
		methods: {
			showSexSelect() {
				this.$refs.sexSelect.open();
				this.hideKeyboard();
			},
			sexSelect(e) {
				this.model.type = e.id;
				this.type = e.name;
			},
			hideKeyboard() {
				uni.hideKeyboard()
			},
			leftClick() {
				uni.navigateBack()
			},
			navigateToAccountLogin() {
				if (this.tellerNo != null) {
					let url = baseURL + '/posTeller/' + this.model.id;
					let model = {
						shopNo: this.model.shopNo,
						tellerName: this.model.tellerName,
						posNo: this.model.posNo,
						pwd: this.model.pwd,
						loginName: this.model.loginName,
						status: this.model.status,
						type: this.model.type,
						id: this.model.id
					}
					uni.request({
						url: url,
						method: 'PUT',
						data: model,
						header: {
							'Authorization': uni.getStorageSync('token') //自定义请求头信息
						},
						success: (res) => {
							console.log(res);
							if (code == "000000") {
								uni.showToast({
									title: '修改成功',
									icon: 'success',
									duration: 2000
								})
								setTimeout(() => {
									wx.navigateTo({
										url: '/pages_subPack/mine/terminal/clerk/index'
									})
								}, 2000)
							} else {
								uni.showToast({
									title: res.data.message
								})
							}
						}
					});
				} else {
					posTellerArr(this.model).then(res => {
						console.log(res)
						console.log(456);
						const code = res.data.code;
						if (code == "000000") {
							uni.showToast({
								title: '新增成功',
								icon: 'success',
								duration: 2000
							})
							setTimeout(() => {
								wx.navigateTo({
									url: '/pages_subPack/mine/terminal/clerk/index'
								})
							}, 2000)
						} else {
							uni.showToast({
								title: res.data.message,
								icon: 'none',
								duration: 2000
							})
						}
					})
				}

			}
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		height: 100vh;
		background: #FFFFFF;
		display: flex;
		align-items: center;
		flex-direction: column;
	}

	.imgData {
		width: 100rpx;
		height: 100rpx;
		border-radius: 20rpx;
		// background-image: url('../../static/index.png');
		background-size: 100% 100%;
	}

	.text {
		width: 90%;
		height: 115rpx;
		border: 1px solid #031A6E;
		border-radius: 15px;
		margin-top: 10%;
	}

	.text-1 {
		display: flex;
		justify-content: space-between;
	}

	/deep/.uv-input {
		height: 115rpx;
	}

	.button-wrap {
		width: 100%;
		margin-top: 60%;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
	}

	.button-login {
		width: 80%;
		height: 110rpx;
		border-radius: 20rpx;
		background: #222d65;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.button-wrap2 {
		margin-top: 20rpx;
	}

	/deep/.uv-form {
		width: 100%;
		display: flex;
		align-items: center;
		flex-direction: column;
	}

	/deep/.uv-form-item {
		width: 100%;
		height: 115rpx;
	}

	/deep/.uv-form-item__body {
		margin: 0 0 0 40rpx;
		height: 115rpx;
	}
</style>